<template>
	<view class="chat">
		<view class="nav nav-wrap">
			<view class="section__title" :class="selected?'yellow':'default'" @tap="selectedFn">弹幕</view>
			<view class="section__title" :class="selected1?'yellow':'default'" @tap="selected1Fn">图片</view>
		</view>
		<view :class="selected?'show':'hidden'">
			<view @tap="outbtn">
				<!--  #ifdef MP-WEIXIN -->
				<scroll-view scroll-y :scroll-into-view='toView' :style="{'height':scrollHeight}">
					<view class="school-list">
						<block v-for="(item,index) in newslist" :key="index">
							<!--自己的消息 -->
							<view :id="'msg-'+index" class="chat-news" v-if="item.nickName == userInfo.nickName">
								<view style="text-align: center;">{{item.date}}</view>
								<!-- <view style="text-align: right;"> -->
								<view style="text-align: left;">
									<text class="name">{{ item.nickName }}</text>
									<image class='new_img' :src="userInfo.avatarUrl"></image>
								</view>
								<!-- <view class='my_right'> -->
								<view class='you_left'>
									<block v-if="item.type=='text'">
										<view class='new_txt'>
											{{item.content}}
											<uni-icons @click="resend(item)" type="reload" size="20" color="#fff" style="float: right;"></uni-icons>
										</view>
									</block>
								</view>

							</view>
							<!-- 别人的消息  -->
							<view :id="'msg-'+index" v-else>
								<view style="text-align: center;">{{item.date}}</view>
								<view class="chat-news">
									<view style="text-align: left;">
										<image class='new_img' :src="item.avatarUrl? item.avatarUrl:'/static/images/avator.png'"></image>
										<text class="name">{{ item.nickName }}</text>
									</view>
									<view class='you_left'>
										<block v-if="item.type=='text'">
											<view class='new_txt'>{{item.content}}</view>
										</block>
									</view>
								</view>
							</view>
						</block>
					</view>
				</scroll-view>
				<!--  #endif -->


				<!--  #ifdef APP-PLUS -->
				<view class="content" id="content" :style="{height: scrollHeight + 'px'}">
					<scroll-view id="scrollview" scroll-y :scroll-into-view='toView' :style="{'height':scrollHeight}" :scroll-top="scrollTop">
						<view class="school-list" id="msglistview">
							<block v-for="(item,index) in newslist" :key="index" class="m-item">
								<!--自己的消息 -->
								<view :id="'msg-'+index" class="chat-news" v-if="item.nickName == userInfo.nickName">
									<view style="text-align: center;">{{item.date}}</view>
									<view style="text-align: left;">
										<text class="name">{{ item.nickName }}</text>
										<image class='new_img' :src="userInfo.avatarUrl"></image>
									</view>
									<view class='you_left'>
										<block v-if="item.type=='text'">
											<view class='new_txt'>
												{{item.content}}
												<uni-icons @click="resend(item)" type="reload" size="20" color="#fff" style="float: right;"></uni-icons>
											</view>
										</block>
									</view>

								</view>
							</block>
						</view>
					</scroll-view>
				</view>
				<!--  #endif -->
			</view>

			<view class="input-text-voice-super" :style="{'bottom':inputBottom}">
				<image src="../../static/images/keyboard.png" class="extra-btn-style" @tap="fastKeyboard" />
				<input type="text" class="chat-input-style" maxlength="500" placeholder="请输入聊天内容..." @confirm="send"
				 :adjust-position='false' confirm-type="send" :value="message" @input="bindChange" @focus="focusFn" @blur="blurFn"
				 style="width: 360rpx;" />
				<button hover="true" hover-class="btnhover" @tap.stop="send" class="chat-input-send-button-style">发送</button>
			</view>

			<view v-if="fastMessage" class="fastKey">
				<view class="fast-info" @tap="fastSend" v-for="(item,index) in fastList" :key="index" :data-text="item.text">{{item.text}}</view>
			</view>
		</view>

		<view :class="selected1?'show':'hidden'">
			<robby-image-upload v-model="imageData" :enable-drag="enableDrag" @delete="deleteImage" @add="addImage" @sendActive="sendActive"
			 :server-url-delete-image="serverUrlDeleteImage" :limit="imgLimit" :showUploadProgress="showUploadProgress"
			 :server-url="serverUrl"></robby-image-upload>
			<view class="cu-bar">
				<view class="action justify-center text-center">
					<button hover="true" hover-class="btnhover" @tap="selectClassify" class="chat-input-send-button-style img-btn"
					 style="display: inline-block;width: 45%;left: 10px;">选择相框</button>
					<button hover="true" hover-class="btnhover" @tap="clearImg" class="chat-input-send-button-style img-btn" style="display: inline-block;width: 45%; right: 10px;">清屏</button>
				</view>
			</view>
		</view>
		<!-- 互动 -->
		<hudong ref="hudong" :hudongIp="hudongIp"></hudong>
		<!-- 相框类别 -->
		<classify-arr ref="classify" :classifyArr="classifyArr" @activeClassifyName="sendImg"></classify-arr>
		<!-- 密码校验 -->
		<check-pwd ref="pwd" :localServerIP="localIP"></check-pwd>
		<!-- 控制 -->
		<e-control ref="control"></e-control>
		<!-- 关于 -->
		<about-us ref="about"></about-us>

		<!-- 功能悬浮球 -->
		<!--bindmenuItemClick为按钮点击的时候的回调方法  mainmodel是显示的按钮，menulist为折叠的菜单的数组数据-->
		<movemenu @menuItemClick="menuItemClick" page-router="chat"></movemenu>
	</view>
</template>

<script>
	const app = getApp()
	import http from '../../utils/http.js'
	import websocket from '../../utils/websocket.js';
	import utils from '../../utils/util.js';
	var windowHeight = uni.getSystemInfoSync().windowHeight;
	var keyHeight = 0; //软盘高度
	var inputHeight = 55; //input宽高度
	var tabarHeight = 66; //底部导航高度
	var timer = null;

	import hudong from '../../components/hudong/index.vue'
	import classifyArr from '../../components/classify/index.vue'
	import checkPwd from '../../components/checkPwd/index.vue'
	import eControl from '../../components/control/index.vue'
	import aboutUs from '../../components/about/index.vue'
	import movemenu from '../../components/movemenu/movemenu.vue'
	import uniIcons from "../../components/uni-icons/uni-icons.vue"
	import robbyImageUpload from '@/components/robby-image-upload/robby-image-upload.vue'
	export default {
		components: {
			uniIcons,
			hudong,
			classifyArr,
			checkPwd,
			eControl,
			aboutUs,
			movemenu,
			robbyImageUpload
		},
		data() {
			return {
				mubuIndex: 0,
				bapingword: "",
				focus: false,
				fastMessage: false,
				newslist: [],
				userInfo: {},
				scrollTop: 0,
				message: "",
				previewImgList: [],
				ip: "",
				scrollHeight: windowHeight - 105 + 'px',
				fastList: [{
						text: "祝你生日快乐！！！！"
					},
					{
						text: "有一种朋友叫做“铁哥们”，有一种关系叫做“志同道合”，有一种友谊叫做“知心如意”，有一种感情叫做“情同手足”"
					},
					{
						text: "勤奋成就理想，自信铸造辉煌，祝你生意兴隆，万事如意。"
					},
					{
						text: "不管未来有多长，请记住成长的路上有你有我，不管经历多少春夏秋冬，请铭记共度的青春年华。"
					}
				],
				menuWidth: 0,
				menuHeight: 0,
				inputBottom: '0px',
				toView: "msg-0",
				notScanCode: true,
				selected: true, //显示弹幕
				selected1: false, //显示图片

				enableDel: false, //删除图标是否可见，即是否可删除
				enableAdd: false, //添加图片操作是否可见，即是否可添加图片
				enableDrag: false, //图片是否可拖动，重新排序
				limitNumber: 9, //限制总共可上传的图片数量，默认无限制
				imageData: [],
				// serverUrl: 'https://jsonplaceholder.typicode.com/posts/',//图片上传的服务器地址，为空或不填写表示不上传图片。
				serverUrl: '', //图片上传的服务器地址，为空或不填写表示不上传图片。
				// serverUrlDeleteImage: 'http://localhost:1234/work/deleteWorkPicture',//删除图片的服务器地址，为空或不填写表示不需要调用后台完成删除操作
				serverUrlDeleteImage: '', //删除图片的服务器地址，为空或不填写表示不需要调用后台完成删除操作
				showUploadProgress: false,
				allImages: [], //图片上墙地址
				imgLimit: 9,
				base64Suffix: '',
				wallpictureName: '',
				wallpictureNameArr: [],
				isDelImg: false,
				localIP: '',
				sendImgIndex: 0,
				isFirst: true,
				oldPicArr: [],
				classifyArr: [],
				newAddImg: [],
				isScrollFull: false,
				hudongIp: '',

				pageHeight: 0,
				contentViewHeight: 0,
				footViewHeight: 90,
				mitemHeight: 0
			}
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {

		},
		onShow: function() {
			console.log('onShow');
			// console.log(app.globalData.userInfo);
			// this.createConnect();
			// uni.showLoading({
			// 	title: '加载中...',
			// 	mask: true
			// })

			//#ifdef MP-WEIXIN
			this.scrollHeight = windowHeight - 60 + 'px';
			//#endif 
			//#ifdef APP-PLUS
			this.scrollHeight = windowHeight - 105 + 'px';
			//#endif 
		},
		onHide: function() {
			console.log("onhide");
			// clearInterval(timer);
			// uni.closeSocket();
		},
		onUnload: function() {
			console.log("onUnload");
			// clearInterval(timer);
			// uni.closeSocket();
		},
		created() {
			this.createConnect();
			uni.showLoading({
				title: '加载中...',
				// mask: true
			})
		},
		mounted() {
			//#ifdef APP-PLUS
			this.scrollToBottom();
			//#endif 
		},
		updated() {
			//#ifdef APP-PLUS
			this.scrollToBottom();
			//#endif 
		},
		methods: {
			scrollToBottom() {

				let that = this
				let query = uni.createSelectorQuery()
				query.select('#scrollview').boundingClientRect()
				query.select('#msglistview').boundingClientRect()
				query.exec((res) => {
					console.log(res)
					if (res[1] != null && res[0] != null) {
						if (res[1].height > res[0].height) {
							that.scrollTop = res[1].height - res[0].height + 20;
						}
					}

				})
			},
			selectedFn: function(e) { //显示弹幕
				this.setData({
					selected: true,
					selected1: false
				});
			},
			selected1Fn: function(e) { //显示发送图片
				this.setData({
					selected: false,
					selected1: true,
				});
			},
			createConnect() {
				var that = this;
				var connectData = utils.getStor('connectData') || '';
				if (connectData == '' || connectData == undefined) {
					this.setData({
						newslist: []
					});
					if (this.notScanCode) {
						uni.showToast({
							title: '登录可能已过期,请尝试重新扫码登录~',
							icon: "none",
							duration: 2000
						});
					}
					this.setData({
						notScanCode: true
					});
					return;
				}
				this.setData({
					userInfo: app.globalData.userInfo,
					ip: connectData
				});

				//获取分类
				let getClassifyInfo = {
					command: 'wallpicture',
					type: '5', //获取照片墙类型
				}

				// websocket.send(JSON.stringify(getClassifyInfo))
				http.httpRequest(getClassifyInfo).then(res => {
					this.returnResult(res)
				}, error => {
					console.log(error);
				})

				//获取全部照片
				that.getAllImg();

			},
			setData(obj) { //转换this.xxx = xxxx
				const keys = Object.keys(obj);
				keys.forEach((key) => {
					this[key] = obj[key];
				});
			},
			sendActive(e) { //发送选中
				console.log(e, 'sendActive')
				this.sendImgIndex = e;
			},
			addImage(e) {
				this.allImages = e.allImages;
				// this.imageData = e.allImages;
				// console.log(e, 'addImage');
				uni.showLoading({
					title: '处理中...'
				})
				setTimeout(() => {
					let num = 0
					//获取文件后缀名
					for (let i = 0; i < e.currentImages.length; i++) {
						let dataMsg = {
							command: 'wallpicture',
							type: '1', //上传
							ip: String(this.ip),
							suffix: String(e.suffixArr[i]),
							pic: String(e.currentImages[i])
						}

						console.log(dataMsg, '发送图片上墙数据')
						// websocket.send(JSON.stringify(dataMsg))
						http.httpRequest(dataMsg).then(res => {
							this.returnResult(res)
						}, error => {
							console.log(error);
						})
					}
					this.isDelImg = true;
				}, 1000)

			},
			async deleteImage(e) {
				// console.log(e, 'deleteImage')
				let delimageIndex = e.imageIndex;
				// console.log(this.wallpictureList,'wallpictureName')

				uni.showLoading({
					title: '处理中...'
				})

				let dataMsg = {
					command: 'wallpicture',
					type: '0', //删除
					imgname: String(this.wallpictureList[delimageIndex].name)
				}

				// console.log(dataMsg, '删除图片信息')
				// await websocket.send(JSON.stringify(dataMsg))

				await http.httpRequest(dataMsg).then(res => {
					this.returnResult(res)
				}, error => {
					console.log(error);
				})

			},
			async getAllImg() { //获取全部照片墙
				let picMsg = {
					"command": 'wallpicture',
					"type": '3'
				}
				// await websocket.send(JSON.stringify(picMsg))
				await http.httpRequest(picMsg).then(res => {
					this.returnResult(res)
				}, error => {
					console.log(error);
				})
			},
			selectClassify() { //点击发送，显示类别窗口

				if (this.imageData.length == 0) {
					uni.showToast({
						title: '请先上传图片~',
						icon: 'none'
					})

					return false;
				}

				this.$refs.classify.modalName = 'RadioModal'
				this.$refs.classify.radio = '默认'
			},
			async sendImg(e) { //发送图片

				let classifyName = e;

				if (this.isScrollFull) {
					// console.log('---------执行清屏---------')
					this.clearImg()
					this.isScrollFull = false;
				}

				// console.log(this.wallpictureNameArr, 'wallpictureNameArr')

				// 第一步  先清屏
				// 第二步  循环发送
				//第三步   发送成功，全部清空，列表清空

				// console.log(this.newAddImg,'this.newAddImg')

				if (this.newAddImg.length > 0) {
					// console.log('新增')
					let dataMsg = {
						command: 'wallpicture',
						mubuIndex: String(app.globalData.mubuIndex),
						type: '2',
						ip: String(this.ip),
						imgname: String(this.newAddImg.join(",")),
						classify: classifyName == undefined ? '默认' : String(classifyName),
					}
					console.log(dataMsg, '播放图片数据')
					// await websocket.send(JSON.stringify(dataMsg));
					await http.httpRequest(dataMsg).then(res => {
						this.returnResult(res)
					}, error => {
						console.log(error);
					})
					this.newAddImg = [];
				} else {
					console.log('原有')
					this.oldPicArr = [];
					let dataMsg = {
						command: 'wallpicture',
						mubuIndex: String(app.globalData.mubuIndex),
						type: '2',
						ip: String(this.ip),
						imgname: String(this.wallpictureNameArr.join(",")),
						classify: classifyName == undefined ? '默认' : String(classifyName)
					}
					console.log(dataMsg, '播放图片数据')
					// await websocket.send(JSON.stringify(dataMsg));
					await http.httpRequest(dataMsg).then(res => {
						this.returnResult(res)
					}, error => {
						console.log(error);
					})
				}

				this.imageData = [];

			},
			async delOldImgs(oldPicArr) {
				// console.log('删除老的')
				let dataMsg = {
					command: 'wallpicture',
					type: '0',
					imgname: oldPicArr.toString() //转成字符串，逗号分隔
				}
				console.log(dataMsg, '播放图片数据')
				// await websocket.send(JSON.stringify(dataMsg));
				await http.httpRequest(dataMsg).then(res => {
					this.returnResult(res)
				}, error => {
					console.log(error);
				})

				setTimeout(() => {
					this.getAllImg()
				}, 1000)

			},
			async clearImg() { //清屏
				this.imageData = [];
				let dataMsg = {
					command: 'wallpicture',
					mubuIndex: String(app.globalData.mubuIndex),
					type: '4'
				}
				console.log(dataMsg, '播放图片数据')
				// await websocket.send(JSON.stringify(dataMsg));
				await http.httpRequest(dataMsg).then(res => {
					this.returnResult(res)
				}, error => {
					console.log(error);
				})
			},
			async allDelImgs() { //删除全部照片
				let dataMsg = {
					"command": 'wallpicture',
					"type": '0'
				}
				// await websocket.send(JSON.stringify(dataMsg));
				await http.httpRequest(dataMsg).then(res => {
					this.returnResult(res)
				}, error => {
					console.log(error);
				})
			},
			//事件处理函数
			send: function() {
				// console.log("点击发送");
				var message = this.message.trim();
				// console.log(message);

				var that = this;
				if (message == "") {
					uni.showToast({
						title: '消息不能为空哦~',
						icon: "none",
						duration: 2000
					})
				} else {
					let dataMsg = {
						"command": "chat",
						"content": String(that.message),
						"date": utils.formatTime(new Date()),
						"type": "text",
						"nickName": String(app.globalData.userInfo.nickName),
						"avatarUrl": String(app.globalData.userInfo.avatarUrl),
						"mubuIndex": String(app.globalData.mubuIndex),
						"ip": String(that.ip)
					}
					console.log(dataMsg, '发送数据');
					// websocket.send(JSON.stringify(dataMsg))
					http.httpRequest(dataMsg).then(res => {
						this.returnResult(res)
						this.scrollToBottom();
					}, error => {
						console.log(error);
					})
				}
			},
			resend(item) {
				console.log(item, 'item')
				let dataMsg = {
					"command": "chat",
					"content": String(item.content),
					"date": utils.formatTime(new Date()),
					"type": "text",
					"nickName": String(app.globalData.userInfo.nickName),
					"avatarUrl": String(app.globalData.userInfo.avatarUrl),
					"mubuIndex": String(app.globalData.mubuIndex),
					"ip": String(this.ip)
				}
				console.log(dataMsg, '发送数据');
				// websocket.send(JSON.stringify(dataMsg))
				http.httpRequest(dataMsg).then(res => {
					this.returnResult(res)
				}, error => {
					console.log(error);
				})
			},
			//监听input值的改变
			bindChange(res) {
				this.setData({
					message: res.detail.value
				});
			},
			/**
			 * 获取聚焦
			 */
			focusFn: function(e) {
				var keyHeight = e.detail.height;
				console.log("获取焦点");
				this.setData({
					scrollHeight: (windowHeight - keyHeight - 46) + 'px'
				});
				this.setData({
					toView: 'msg-' + (this.newslist.length - 1),
					inputBottom: (keyHeight - 46) + 'px'
				})
				// console.log("scrollHeight：" + this.scrollHeight);
				// console.log("toView: " + this.newslist.length);
			},
			//失去聚焦(软键盘消失)
			blurFn: function(e) {
				console.log("失去聚焦");
				this.setData({
					scrollHeight: (windowHeight - 50) + 'px'
				});
				this.setData({
					inputBottom: '0px'
				})
				// console.log(this.scrollHeight, this.newslist.length);
			},
			//图片预览
			previewImg(e) {
				var that = this
				//必须给对应的wxml的image标签设置data-set=“图片路径”，否则接收不到
				var res = e.target.dataset.src
				var list = this.previewImgList //页面的图片集合数组

				//判断res在数组中是否存在，不存在则push到数组中, -1表示res不存在
				if (list.indexOf(res) == -1) {
					this.previewImgList.push(res)
				}
				uni.previewImage({
					current: res, // 当前显示图片的http链接
					urls: that.previewImgList // 需要预览的图片http链接列表
				})

			},
			//点击空白隐藏message下选框
			outbtn() {
				this.setData({
					fastMessage: false
				})
			},
			inputbaping: function(e) {
				this.setData({
					bapingword: e.detail.value
				})
			},
			fastKeyboard: function() {
				this.setData({
					fastMessage: !this.fastMessage
				})
			},
			fastSend: function(e) {
				let that = this;
				var message = e.currentTarget.dataset.text;
				let dataMsg = {
					"command": "chat",
					"content": String(message),
					"date": utils.formatTime(new Date()),
					"type": "text",
					"nickName": String(app.globalData.userInfo.nickName),
					"avatarUrl": String(app.globalData.userInfo.avatarUrl),
					"mubuIndex": String(app.globalData.mubuIndex),
					"ip": String(that.ip)
				}
				console.log(dataMsg, 'fastSend')
				// websocket.send(JSON.stringify(dataMsg))
				http.httpRequest(dataMsg).then(res => {
					this.returnResult(res)
					this.scrollToBottom();
				}, error => {
					console.log(error);
				})

				this.setData({
					fastMessage: false
				})
			},
			returnResult(res) { //http返回的结果
				let that = this;

				if (res == undefined) {
					uni.showToast({
						title: '登录可能已过期,请尝试重新扫码登录~',
						icon: "none",
						duration: 2000
					});
					return false;
				}

				// var jsonObj = JSON.parse(res.data);
				if (res.data != undefined) {
					var jsonObj = res.data;
					console.log(jsonObj, '服务器返回的消息');
					// console.log(jsonObj.command);

					if (jsonObj.command == "sendctrl") {
						if (jsonObj.result == "FAILED") {
							utils.showErrorMsgFun(jsonObj);
						}
					}

					if (jsonObj.command == "login") {
						uni.hideLoading()
						if (jsonObj.result == "SUCCESS") {
							uni.hideLoading()
						} else {
							utils.showErrorMsgFun(jsonObj);
						}
					}

					//播放器有没有显示弹幕
					if (jsonObj.command == "chat") {
						if (jsonObj.result == "SUCCESS") {
							that.message = '';
							console.log('播放器弹幕显示成功');
						} else if (jsonObj.result == "FAILED") {
							// if (jsonObj.pfailMsg != undefined && jsonObj.pfailMsg != null && jsonObj.pfailMsg != "") {
							// 	if (jsonObj.pfailMsg == '[P10026]弹幕显存不足') {
							// 		uni.showToast({
							// 			title: '[errCode:' + jsonObj.pfailCode + ']队列中,请稍后再试~',
							// 			icon: 'none',
							// 			duration: 2000
							// 		})
							// 	} else {
							// 		uni.showToast({
							// 			title: jsonObj.pfailMsg,
							// 			icon: 'none',
							// 			duration: 2000
							// 		})
							// 	}
							// } else {
							// 	if (jsonObj.message != undefined && jsonObj.message != null && jsonObj.message != "") {
							// 		uni.showToast({
							// 			title: jsonObj.message,
							// 			icon: 'none',
							// 			duration: 2000
							// 		})
							// 	} else {
							// 		uni.showToast({
							// 			title: '操作失败!',
							// 			icon: 'none',
							// 			duration: 2000
							// 		})
							// 	}
							// }
						}
					}

					if (jsonObj.command == "wallpicture") {
						if (jsonObj.result == "SUCCESS") {

							if (jsonObj.pfailMsg != undefined && jsonObj.pfailMsg != null && jsonObj.pfailMsg != "") {
								if (jsonObj.pfailMsg == "[P10050]屏幕已经满了") {
									// console.log('清屏')
									uni.showToast({
										title: '屏幕已满或在队列中,请尝试再次发送...',
										icon: 'none',
										duration: 2000
									})

									setTimeout(() => {
										that.allDelImgs();
									}, 2000)

									that.isScrollFull = true;
								}

								return false;
							}



							// console.log('图片上墙列表')
							if (jsonObj.datas != undefined && jsonObj.datas.length > 0) {
								console.log('--------执行了-------')
								if (jsonObj.datas[0].val != undefined) {
									let newImageData = [];
									let newWallpictureNameArr = []
									for (let i = 0; i < jsonObj.datas.length; i++) {
										if (jsonObj.datas[i].val != undefined) {
											let base64 = jsonObj.datas[i].val;
											let imgname = jsonObj.datas[i].name;
											newImageData.push(base64.replace(/[\r\n]/g, ""));

											newWallpictureNameArr.push(imgname)
										}
									}

									// console.log(newWallpictureNameArr,'newWallpictureNameArr')
									that.imageData = newImageData;
									that.wallpictureNameArr = newWallpictureNameArr;
									that.wallpictureList = jsonObj.datas;
									// console.log(that.wallpictureNameArr,'that.wallpictureNameArr')
								} else {
									that.classifyArr = jsonObj.datas;
								}

							} else {
								if (jsonObj.datas != undefined && jsonObj.datas.length == 0) {
									that.imageData = [];
								}

								if (jsonObj.datas == undefined && jsonObj.imgname == undefined) {
									console.log('执行删除全文件操作')
									that.allDelImgs()
								}

								if (jsonObj.imgname != undefined) {
									that.newAddImg.push(jsonObj.imgname)
								}

								// console.log(that.newAddImg,'that.newAddImg')
							}

							uni.hideLoading()

						} else if (jsonObj.result == "FAILED") {
							// 		if (jsonObj.pfailMsg != undefined && jsonObj.pfailMsg != null && jsonObj.pfailMsg != "") {

							// 			uni.showToast({
							// 				title: jsonObj.pfailMsg,
							// 				icon: 'none',
							// 				duration: 2000
							// 			})
							// 		} else {
							// 			if (jsonObj.message != undefined && jsonObj.message != null && jsonObj.message != "") {
							// 				uni.showToast({
							// 					title: jsonObj.message,
							// 					icon: 'none',
							// 					duration: 2000
							// 				})
							// 			} else {
							// 				uni.showToast({
							// 					title: '操作失败!',
							// 					icon: 'none',
							// 					duration: 2000
							// 				})
							// 			}
							// 		}
						}

						setTimeout(() => {
							if (that.isDelImg) {
								console.log('再次获取')
								that.isDelImg = false;
								that.getAllImg();
							}
						}, 1000)

					}

					//接收广播消息
					if (jsonObj.command == "chat") {
						// console.log(jsonObj.data,'jsonObj')
						var list = [];
						list = that.newslist;
						var item = {};
						item.nickName = jsonObj.data.nickName;
						item.avatarUrl = jsonObj.data.avatarUrl;
						item.content = jsonObj.data.content;
						item.date = jsonObj.data.date;
						item.type = jsonObj.data.type;
						console.log(item);
						list.push(item);
						var scrollTop = list.length * 130;
						that.setData({
							newslist: list
						});
						that.setData({
							toView: 'msg-' + (that.newslist.length - 1),
						})
						console.log(that.newslist.length);
					}


					//互动服务器
					if (jsonObj.command == "hudong" && jsonObj.result == 'SUCCESS') {
						uni.showToast({
							title: '操作成功～',
							icon: 'none'
						})
					}
				}
			},
			menuItemSendHttp(data) { //搜索菜单发送请求
				http.httpRequest(data).then(res => {
					// console.log(res,'http获取到的数据');
					this.returnResult(res)
				}, error => {
					console.log(error);
				})
			},
			menuItemClick: function(res) {
				// console.log(res, '--------res-------')
				//获取点击事件的信息
				let clickInfo = res;
				// console.log(clickInfo);
				// 根据不同类型进行判别处理
				//事件的处理 代码
				switch (clickInfo.id) {
					case "1":
						// websocket.send('{ "command": "vol","mubuIndex":' + Number(app.globalData.mubuIndex) + ',"type":0,"ctl":0}');
						let volUp = {
							command: "vol",
							mubuIndex: String(app.globalData.mubuIndex),
							type: '0',
							ctl: '0'
						}
						this.menuItemSendHttp(volUp);
						break;
					case "2":
						// websocket.send('{ "command": "vol","mubuIndex":' + Number(app.globalData.mubuIndex) + ',"type":0,"ctl":1}');
						let volDown = {
							command: "vol",
							mubuIndex: String(app.globalData.mubuIndex),
							type: '0',
							ctl: '1'
						}
						this.menuItemSendHttp(volDown);
						break;
					case "3":
						if (clickInfo.isPlayVideo) { //播放
							// websocket.send('{ "command": "vol","mubuIndex":' + Number(app.globalData.mubuIndex) + ',"type":1,"ctl":1}');
							let play = {
								command: "vol",
								mubuIndex: String(app.globalData.mubuIndex),
								type: '1',
								ctl: '1'
							}
							this.menuItemSendHttp(play);
						} else { //暂停
							// websocket.send('{ "command": "vol","mubuIndex":' + Number(app.globalData.mubuIndex) + ',"type":1,"ctl":0}');
							let pause = {
								command: "vol",
								mubuIndex: String(app.globalData.mubuIndex),
								type: '1',
								ctl: '0'
							}
							this.menuItemSendHttp(pause);
						}
						break;
					case "5":
						// websocket.send('{ "command": "sendctrl","v":"43","d":{"k1":' + app.globalData.mubuIndex + ',"k2":1}}');
						let pause = {
							command: "sendctrl",
							v: '43',
							d: JSON.stringify({
								k1: String(app.globalData.mubuIndex),
								k2: '1'
							})
						}
						this.menuItemSendHttp(pause);
						break;
					case "6":
						this.setData({
							notScanCode: false
						});

						//#ifdef MP-WEIXIN
						app.globalData.loginType = 0;
						//#endif 

						//#ifdef APP-PLUS
						app.globalData.loginType = 1;
						//#endif 

						uni.scanCode({
							success: (res) => {
								let arr = [];
								if(res.result.indexOf("http://mp2")==0){
									arr = res.result.split("=")[1].split(",");
								}else{
									arr = res.result.split(",");
								}
								console.log(arr);
								if (arr.length > 1) {
									app.globalData.mubuIndex = arr[1];
									utils.setStor('connectData', arr[0]);
									uni.setStorageSync('mubuIndex', arr[1]);

								} else {
									app.globalData.mubuIndex = 0;
									utils.setStor('connectData', arr);
									uni.setStorageSync('mubuIndex', 0);
								}
								this.setData({
									ip: utils.getStor('connectData'),
									items: []
								});
								// uni.closeSocket()
								this.createConnect();
							},
							fail: (res) => {
								uni.showToast({
									title: '扫码失败~',
									icon: 'none',
									duration: 2000
								})
							},
							complete: (res) => {}
						});
						break;
					case "7":
						if (app.globalData.mainMubuNo == 1) {
							uni.showToast({
								title: '暂无操作权限~',
								icon: 'none'
							})
						} else {
							// websocket.send('{ "command": "sendctrl","v":"43","d":{"k1":' + app.globalData.mubuIndex + ',"k2":0}}');
							let bg = {
								command: "sendctrl",
								v: '43',
								d: JSON.stringify({
									k1: String(app.globalData.mubuIndex),
									k2: '0'
								})
							}
							this.menuItemSendHttp(bg);
						}
						break;
					case "8": //控制按钮
						// this.$refs.control.pwdDialog = 'checkPwd'
						// this.$refs.control.isShowSelectOpt = true
						let serverIP = '';
						//#ifdef MP-WEIXIN
						uni.showToast({
							title: '暂时无法使用~',
							icon: 'none'
						})
						// this.$refs.pwd.pwdDialog = 'Modal'
						// serverIP = uni.getStorageSync('zkLocalIP') || '';

						// if(serverIP == '' || serverIP == undefined){
						// 	this.localIP = serverIP
						// }else{
						// 	this.localIP = serverIP
						// }
						//#endif 

						//#ifdef APP-PLUS
						this.$refs.pwd.pwdDialog = 'Modal'
						serverIP = uni.getStorageSync('zkLocalIP') || '';
						if (serverIP == '' || serverIP == undefined) {
							this.localIP = serverIP
						} else {
							this.localIP = serverIP
						}
						//#endif 
						break;
					case "9": //互动
						this.$refs.hudong.modalName = 'modal'
						this.hudongIp = uni.getStorageSync('hudongIp') || '';
						break;
					case "10": //关于
						this.$refs.about.modalName = 'modal'
						break;
				}
			},
		}
	}
</script>

<style>
	/* page {
		background-color: #313247;
	} */
</style>

<style scoped>
	page {
		background-color: #313247;
		height: 100%;
	}

	.nav {
		width: 100%;
		height: 90rpx;
		display: flex;
		flex-direction: row;
		color: #ffffff;
		background-color: #3A3A52;
		position: fixed;
		top: 0rpx;
		z-index: 23;
	}

	.default {
		line-height: 90rpx;
		text-align: center;
		flex: 1;
		color: #fff;
		font-size: 20px;
	}

	.yellow {
		line-height: 90rpx;
		text-align: center;
		color: #FFE570;
		flex: 1;
		font-size: 20px;
	}

	.show {
		display: block;
		widows: 750rpx;
	}

	.hidden {
		display: none;
		widows: 750rpx;
	}

	.section__title {
		z-index: 2;
		font-size: 20px;
		color: #fff;
	}

	.schoollist {
		height: 100%;
		width: 100%;
		display: flex;
		border-top: 0px;
	}

	.school-list {
		padding: 40rpx 40rpx 0 40rpx;
		margin-bottom: 120rpx;
	}

	/* 聊天内容 */
	.chat-wrap {
		display: table;
		max-width: 400rpx;
		min-height: 60rpx;
		margin: 10rpx 10rpx 40rpx 10rpx;
	}

	.chat-item {
		box-shadow: 0 5rpx 10rpx 5rpx #ffffff;
		word-break: break-all;
		word-wrap: break-word;
		color: #ffffff;
		border-radius: 15rpx;
		display: table-cell;
		vertical-align: middle;
		padding: 0 20rpx;
		margin-bottom: 20rpx;
	}

	.news {
		text-align: center;
		box-sizing: border-box;
	}

	.chat-notice {
		text-align: center;
		font-size: 30rpx;
		padding: 10rpx 0;
		color: #666;
	}

	.historycon {
		height: 100%;
		width: 100%;
		display: flex;
		border-top: 0px;
	}

	/* 聊天 */

	.chat-item {
		box-shadow: 0 5rpx 10rpx 5rpx #fff;
		word-break: break-all;
		word-wrap: break-word;
		color: #fff;
		border-radius: 15rpx;
		display: table-cell;
		vertical-align: middle;
		padding: 0 20rpx;
		text-align: left;
	}

	input {
		padding-top: 10rpx;
		padding-bottom: 10rpx;
		/* width: 100%; */
	}

	.extra-btn-style {
		width: 65rpx;
		height: 65rpx;
		padding: 5rpx 20rpx;
		display: flex;
		flex-shrink: 0;
		margin-left: 40rpx;
	}

	.input-text-voice-super {
		display: flex;
		flex-direction: row;
		width: 100%;
		height: 110rpx;
		align-items: center;
		position: fixed;
		left: 0;
		background-color: #313247;
		z-index: 20;
	}

	.list-divide-line {
		width: 100%;
		height: 1rpx;
		background-color: #ddd;
	}

	.chat-input-style {
		border-radius: 20rpx;
		border: 1rpx solid #fff;
		margin-top: 14rpx;
		margin-bottom: 13rpx;
		padding: 10rpx 20rpx;
		min-height: 45rpx;
		color: #ffffff;
	}

	.chat-input-send-button-style {
		width: 170rpx;
		height: 70rpx;
		line-height: 70rpx;
		padding: 0 10rpx;
		font-size: 30rpx;
		text-align: center;
		/* margin: 0 45rpx 0 20rpx; */
		border-radius: 15rpx;
		border: 1rpx solid #fff;
		color: #fff;
		background-color: transparent;

	}

	.img-btn {
		width: 90%;
		position: fixed;
		/* left: 16rpx; */
		bottom: 20rpx;
	}

	.btnhover {
		border: 1rpx solid #ffffff;
		color: #3A3A52;
		background-color: #ffffff;
	}

	/* 聊天 */

	.chat-news {
		width: 100%;
		overflow: hidden;
		margin-top: 10px;
	}

	.chat-news .my_right {
		float: right;
		padding: 10rpx 10rpx;
	}

	.chat-news .name {
		margin-right: 10rpx;
		color: #fff;
	}

	.chat-news .you_left {
		float: left;
		padding: 10rpx 10rpx;
	}

	.selectImg {
		display: inline-block;
		width: 150rpx;
		height: 150rpx;
		margin-left: 50rpx;
	}

	.my_right .selectImg {
		margin-right: 80rpx;
	}

	.new_img {
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
		vertical-align: middle;
		margin-right: 10rpx;
	}

	.new_txt {
		max-width: 500rpx;
		display: inline-block;
		line-height: 60rpx;
		border-radius: 15rpx;
		border: 2rpx solid #fff;
		padding: 5rpx 20rpx;
		color: #fff;
		margin: 0 10rpx;
		margin-left: 50rpx;
	}

	.you {
		background-color: lightgreen;
	}

	.my {
		border-color: transparent transparent transparent #95d4ff;
	}

	.you {
		border-color: transparent #95d4ff transparent transparent;
	}

	.hei {
		margin-top: 50px;
		height: 20rpx;
	}

	.history {
		padding: 0 40rpx;
		font-size: 28rpx;
		line-height: 40px;
		word-break: break-all;
		background-color: #95d4ff;
	}

	::-webkit-scrollbar {
		width: 0;
		height: 0;
		color: transparent;
		z-index: -1;
	}

	/* 信息输入区域 */
	.chat-input {
		position: fixed;
		bottom: 120rpx;
		width: 100%;
	}

	.increased {
		width: 100%;
		padding: 40rpx 30rpx;
		background-color: #fff;
	}

	.increased .image {
		width: 100rpx;
		height: 100rpx;
		border: 3rpx solid #ccc;
		line-height: 100rpx;
		text-align: center;
		border-radius: 8rpx;
		font-size: 35rpx;
	}

	@keyframes slidedown {
		from {
			transform: translateY(0);
		}

		to {
			transform: translateY(100%);
		}
	}

	.slidedown {
		animation: slidedown 0.5s linear;
	}

	.slideup {
		animation: slideup 0.5s linear;
	}

	@keyframes slideup {
		from {
			transform: translateY(100%);
		}

		to {
			transform: translateY(0);
		}
	}

	/* 快捷輸入 */
	.fastKey {
		position: fixed;
		bottom: 111rpx;
		left: 40rpx;
		width: 500rpx;
		background-color: #3A3A52;
		color: #fff;
		border: 1rpx solid #fff;
	}

	.fast-info {
		border-bottom: 2rpx solid #ccc;
		padding: 10rpx 20rpx;
		font-size: 18px;
	}

	/* 功能按键 */
	.menuarea {
		height: 80%;
		padding: 70rp 40rpx;
	}
	
	
	
	@media screen and (min-width: 769px) {
		.nav {
			height: 60rpx !important;
		}
	
		.nav view {
			font-size: 20px !important;
			line-height: 60rpx !important;
		}
	
		.nav .default {
			line-height: 60rpx !important;
		}
	}
	
	@media screen and (min-device-width: 641px) and (max-device-width: 768px) {
		.nav {
			height: 60rpx !important;
		}
	
		.nav view {
			font-size: 20px !important;
			line-height: 60rpx !important;
		}
	
		.nav .default {
			line-height: 60rpx !important;
		}
	}
	
	
	@media screen and (min-device-width: 401px) and (max-device-width: 640px) {
		.nav {
			width: 100%;
			height: 90rpx;
			display: flex;
			flex-direction: row;
			color: #ffffff;
			background-color: #3A3A52;
			position: fixed;
			top: 0rpx;
			z-index: 23;
		}
		
		.default {
			line-height: 90rpx;
			text-align: center;
			flex: 1;
			color: #fff;
			font-size: 20px;
		}
	}
	
	@media only screen and (max-device-width: 400px) {
		.nav {
			width: 100%;
			height: 90rpx;
			display: flex;
			flex-direction: row;
			color: #ffffff;
			background-color: #3A3A52;
			position: fixed;
			top: 0rpx;
			z-index: 23;
		}
		
		.default {
			line-height: 90rpx;
			text-align: center;
			flex: 1;
			color: #fff;
			font-size: 20px;
		}
	}
</style>
